{include file="public/common" /}

<fieldset class="layui-elem-field layui-field-title" style="text-align:center">
    <legend> 商品</legend>
</fieldset>

<form class="layui-form" action="" style="padding:5px" id="seller_goods_form">
    <input type="hidden" name="role_is_admin" value="1">
    <div class="layui-form-item">
        <label class="layui-form-label">商品名称</label>
        <div class="layui-input-block">
            <input type="text" name="goods_name" autocomplete="off" lay-verify="required" placeholder="请输入商品名称"
                   class="layui-input" value="<?php echo isset($goods_data->goods_name)?$goods_data->goods_name:''?>">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">优化搜索</label>
        <div class="layui-input-block">
            <input type="text" name="seo" autocomplete="off"  placeholder="请输入优化搜索名称"
                   class="layui-input" value="<?php echo isset($goods_data->seo)?$goods_data->seo:''?>">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">产地</label>
        <div class="layui-input-block">
            <input type="text" name="place_of_origin" autocomplete="off" lay-verify="required" placeholder="请输入产地"
                   class="layui-input"
                   value="<?php echo isset($goods_data->place_of_origin)?$goods_data->place_of_origin:''?>">
        </div>
    </div>

    <div class="layui-form-item" name="goods_category_select">
        <div class="layui-inline seled" id="sel[0]">
            <label class="layui-form-label">商品类型</label>
            <div class="layui-input-block">
                <select  name="goods_category[0]" lay-filter="selected_category">
                    <option value="">请选择</option>
                    {volist name="$goods_category" id="item"}
                    <option value="{$item.id}" title="{:urlencode(json_encode(isset($item['son'])?$item['son']:0))}">
                        {$item.category_name}
                    </option>
                    {/volist}
                </select>
            </div>
        </div>
    </div>
    {if condition="isset($selected_goods_category)"}
    <div class="layui-form-item">
        <div class="layui-inline">
            <label class="layui-form-label">已选分类</label>
            <div class="layui-input-block">
                <p style="padding: 9px 0;color: #ff0000;font-weight: bold" > {$selected_goods_category}</p>
            </div>
        </div>
    </div>
    {/if}

    <div class="layui-form-item">
        <label class="layui-form-label">上传图片</label>
        <input type="file" name="file" id="image_upload" class="layui-upload-file" lay-title="上传图片">

        <div id="image_div" style="margin:10px 0 10px 110px;">
            <input type="hidden" name="image" id="image_input" value="<?php echo isset($goods_data->image)?$goods_data->image:''?>">
        </div>
    </div>

    <div class="layui-form-item">
        <label class="layui-form-label">原价（￥）</label>

        <div class="layui-input-inline">
            <input type="number" name="pre_price" lay-verify="required" placeholder="原价" autocomplete="off"
                   class="layui-input"
                   value="<?php echo isset($goods_data->pre_price)?$goods_data->pre_price:''?>">
        </div>
    </div>

    <div class="layui-form-item">
        <label class="layui-form-label">真实价格（￥）</label>

        <div class="layui-input-inline">
            <input type="number" name="price" lay-verify="required" placeholder="原价" autocomplete="off"
                   class="layui-input"
                   value="<?php echo isset($goods_data->price)?$goods_data->price:''?>">
        </div>
    </div>

    <div class="layui-form-item">
        <label class="layui-form-label">库存</label>

        <div class="layui-input-inline">
            <input type="number" name="stock" lay-verify="required" autocomplete="off" placeholder="请输入库存"
                   class="layui-input" value="<?php echo isset($goods_data->stock)?$goods_data->stock:'' ?>">
        </div>
    </div>


    <div class="layui-form-item">
        <label class="layui-form-label">商品重量(g)</label>

        <div class="layui-input-inline">
            <input type="number" name="weight" lay-verify="required" placeholder="请输入商品重量" autocomplete="off"
                   class="layui-input" value="<?php echo isset($goods_data->weight)?$goods_data->weight:'' ?>">
        </div>
    </div>
    <div class="layui-form-item" style="display:none;" id="bar_code_input">
        <label class="layui-form-label">商品条形码</label>

        <div class="layui-input-block">
            <input type="text" name="bar_code" autocomplete="off" placeholder="请输入商品条形码"
                   class="layui-input" value="<?php echo isset($goods_data->bar_code)?$goods_data->bar_code:''?>">
        </div>
    </div>
    <div class="layui-form-item layui-form-text">
        <label class="layui-form-label">商品详情</label>

        <div class="layui-input-block">
            <textarea class="layui-textarea layui-hide" name="content" id="content"><?php echo isset($goods_data->
                content)?$goods_data->content:''  ?></textarea>
        </div>
    </div>

    <div class="layui-form-item">
        <div class="layui-input-block">
            <button class="layui-btn" lay-submit="" lay-filter="submit_">立即提交</button>
            <button type="reset" class="layui-btn layui-btn-primary">重置</button>
        </div>
    </div>

</form>
<script>
    decodeURI
    $(function () {
        layui.use('layedit', function () {
            layedit = layui.layedit
                    , $ = layui.jquery;
            layedit.set({
                uploadImage: {
                    url: '/index/tool/layui_upload', //接口url
                    type: 'post'//默认post
                }
            });
            //构建一个默认的编辑器
            index = layedit.build('content');
        });

        layui.use(['form', 'layedit', 'laydate'], function ()
        {
            var form = layui.form()
                    , layer = layui.layer
                    , layedit = layui.layedit;
            /**
             * 商品模板的选择事件
             */
            form.on('select(selected_category)', function (data) //第一个select的onchange触发事件
            {
                $(this).parent().parent().parent().parent().nextAll().remove();
                console.log(data.elem[data.elem.selectedIndex].title);
                var category = data.elem[data.elem.selectedIndex].title;
                category = decodeURIComponent(category);
                if(category != "0")  //上层分类含有子类
                {
                    var key = data.value;
                    var category_ = JSON.parse(category);
                    html = '<div  class="layui-inline seled" id="sel['+key+'] "><div class="layui-input-block">'
                            +'<select name="goods_category['+key+']" lay-filter="selected_category">';
                    html += "<option value=''>请选择</option>";
                    $.each(category_, function (k, v)
                    {
                        console.log(v);
                        if(v.son)
                        {
                            html += "<option value='" + v.id + "' title='"+encodeURI(JSON.stringify(v.son))+"'>" + v.category_name + "</option>";
                        }else
                        {
                            html += "<option value='" + v.id + "' title='0'>" + v.category_name + "</option>";
                        }

                    });
                    html += '</select></div></div>'
                    $("div[name='goods_category_select']").append(html);
                    form.render();
                }
            });
            /* 提交表单 */
            form.on('submit(submit_)', function (data) {
                var i_data = $.extend(data.field, {
                    "content": layedit.getContent(index)
                });
                $.ajax({
                    url: "{:addon_url('admin://goods/edit')}?goods_id={:input('goods_id')}",
                    dataType: "json",
                    async: true,
                    data: i_data,
                    type: "POST",
                    success: function (res)
                    {
                        if (res.code != 0)
                        {
                            layer.alert(res.data, {icon: 5});
                        }
                        else
                        {
                            layer.msg(res.data, {
                                icon: 1,
                                time: 2000
                            }, function(){
                                //var url = "/admin/index/goods_list?status=0";
                                // window.open(url, "_parent")
                            });
                        }
                    }
                });
                return false;
            });

        });
        layui.use('upload', function () {
            layui.upload({
                url: '/index/tool/upload' //上传接口
                , elem: '#image_upload' //指定原始元素，默认直接查找class="layui-upload-file"
                , success: function (res) { //上传成功后的回调
                    console.log(res);
                    if (res.code == 0) {
                        var src =  res.data;
                        success_handle( src );
                    }
                }

            });
        });
    });
    /**
     * 数据初始化
     *
     */
    $(function () {
        var src = $("#image_input").val();
        src = src.split(";");
        for (i in src) {
            var src_ = src[i];
            if (src_.length > 2) {
                success_handle(src_);
            }
        }
    });


    /**
     * 成功处理
     */
    function success_handle(src) {
        var i_div = $("<div>", {style: "float: left; position:relative;"});
        var image = $("<img>", {src: src, style: "width:150px; height:80px;margin-left: 12px;"});
        //删除按钮
        var del_btn = $("<a href='javascript:void(0);' onclick='del_img(this)' class='layui-icon' style='position:absolute; right: 2px; top: 2px;'>&#xe640;</a>");
        i_div.append(image).append(del_btn);
        $("#image_div").append(i_div);
        update_img_value("image_div", "image_input");
    }


    /**
     * 更新图片
     * @param id
     * @param input
     */
    function update_img_value(id, input) {
        var val = "";
        var img_gro = $("#" + id + " img");
        for (var i = 0; i < img_gro.length; i++) {
            val += $("#" + id + " img:eq(" + i + ")").attr("src") + ";";
        }
        console.log(val);
        $("#" + input).val(val);
    }
    //删除审核图片
    function del_img(e) {
        var val = "";
        $(e).parent().prevAll("div").find("img:eq(0)").each(function () {
            val += $(this).attr("src") + ";";
        });
        $(e).parent().nextAll("div").find("img:eq(0)").each(function () {
            val += $(this).attr("src") + ";";
        });
        $(e).parent().prevAll("input").val(val);
        $(e).parent().remove();
    }
</script>